.headerbox {
    // position: absolute;

    .img-wrapper {
        img {
            margin-top: 10px;
            width: 20%;
            border-radius: 3%;
            transform: rotate(3deg);
            -ms-transform: rotate(3deg);
            /* IE 9 */
            -moz-transform: rotate(3deg);
            /* Firefox */
            -webkit-transform: rotate(3deg);
            /* Safari 和 Chrome */
            -o-transform: rotate(3deg);
        }

    }

    .title {
        position: absolute;
        right: 610px;
        top: 100px;
        background-color: orange;
        width: 100px;
        height: 30px;
        line-height: 30px;
        border-radius: 13%;
        border-bottom-right-radius: 1em;
        transform: rotate(7deg);
        -ms-transform: rotate(7deg);
        /* IE 9 */
        -moz-transform: rotate(7deg);
        /* Firefox */
        -webkit-transform: rotate(7deg);
        /* Safari 和 Chrome */
        -o-transform: rotate(7deg);
    }
}

.centerbox {
    margin-top: 20px;

    .shuru {
        width: 250px;
        text-align: center ;
        border: 1px solid white;
        background-color: transparent;
        border-bottom: 4px orange dashed;
        outline: 0px white;
    }

    .sub {
        margin-left: 5px;
        position: relative;
        border-radius: 6px;
        transform: rotate(3deg);
        -ms-transform: rotate(3deg);
        /* IE 9 */
        -moz-transform: rotate(3deg);
        /* Firefox */
        -webkit-transform: rotate(3deg);
        /* Safari 和 Chrome */
        -o-transform: rotate(3deg);
        font-size: 13.5px;
        background-color: #fff;
        padding-bottom: 0;
        font-family: Yanone Kaffeesatz, sans-serif;
        border-radius: inherit;
    }

    .sub:active {
        // transform: 4px;
        transform: scale(1.2);
        box-shadow: 3px 2px 22px 1px white;

    }

    .uls {
        position: relative;
        top: 20px;
        border: 2px solid red;
        margin: 0 auto;
        height: 200px;
        overflow-y: scroll;

        ul li {
            list-style: none;
            width: 250px;
            background-color: orange;
            text-align: left;
            margin: 7px;
            font-family: '华文琥珀';

            .buttonss {
                float: right;
                margin-right: 10px;
                transform: rotate(3deg);
                -ms-transform: rotate(7deg);
                -moz-transform: rotate(7deg);
                -webkit-transform: rotate(7deg);
                -o-transform: rotate(7deg);
            }

            .buttonss:active {
                // transform: 4px;
                transform: scale(1.2);
                box-shadow: 3px 2px 22px 1px white;

            }

            input {
                margin-right: 20px;
            }
        }
    }
}

.foolterbox {
    position: relative;
    top: 100px;
    height: 50px;
    line-height: 50px;
    background-color: beige;
    border-radius: 20px;

    .bottom_box {
        display: flex;
        justify-content: space-between;

        .anniu {
            // background-color: green;

            span {
                background-color: pink;
                margin-left: 5px;
            }
        }
    }
}